<?php
$allTemplateFile = \Core\Helper\ApplicationDirectoryHelper::getAllTemplateFile();
$fileNameAsJson = Zend\Json\Json::encode($allTemplateFile);
?>

<div class="ad_title_ctn">
    <h2>Quản lý template</h2>
</div>
<div class="ad_content_ctn">
    <div id="grid"></div>
</div>
<script type="text/x-kendo-template" id="template">
    <div class="toolbar">


        <a class="k-button k-button-icontext  k-grid-edit k-grid-edit k-grid-edit"
           href="/admin/template/add">
            <span class="k-icon k-add"></span>Tạo mới
        </a>

    </div>
</script>
<script>

    $(document).ready(function () {

        var allFileNames = <?php echo $fileNameAsJson ?>;

        dataSource = new kendo.data.DataSource({
            type: "jsonp",
            transport: {

                read: function(options) {
                    $.ajax( {
                        url: "<?php echo '/admin/template/list'  ?>",
                        data: options.data, // the "data" field contains paging, sorting, filtering and grouping data
                        success: function(result) {

                            if(result.success){
                                options.success(result);
                                $('#error_ctn').html('');
                            }else{
                                $('#error_ctn').html(result.msg);
                                grid = $("#grid").data("kendoGrid");
                                // cancel changes
                                grid.cancelChanges();
                            }
                        },

                        dataType: "json",
                        type: "POST"

                    });
                },



                destroy: function(options) {
                    $.ajax( {
                        url: "/admin/template/remove?id="+options.data.id,
                        data: options.data,
                        success: function(result) {
                            if(result.success){
                                options.success(options.data.models);
                                $('#error_ctn').html('Xóa thành công.');
                            }else{
                                $('#error_ctn').html(result.msg);
                                 grid = $("#grid").data("kendoGrid");
                                // cancel changes
                                grid.cancelChanges();
                            }


                        },
                        dataType: "json",
                        type: "POST"

                    });
                },
                update: function(options) {
                    // make AJAX request to the remote service

                    $.ajax( {
                        url: "/admin/template/light-update",
                        data: options.data, // the "data" field contains paging, sorting, filtering and grouping data
                        success: function(result) {
                            // notify the DataSource that the operation is complete

                            options.success(options.data.models);
                        },
                        dataType: "json",
                        type: "POST"
                    });
                }
            },
            schema: {
                model: {
                    id: "id",
                    fields: {
                        id: {editable: false,  type: "number" },
                        name: { type: "string" ,validation: { required: true }},
                        description: { type: "string" },
                        file_name: { type: "string" },
                        created_date: { type: "date" }
                    }
                },
                data: "rows"
            },
//                    batch: true,
            pageSize: 100
        });

        $("#grid").kendoGrid({
            dataSource: dataSource,
            navigatable: true,
            pageable: false,
            columnMenu: true,
            sortable: true,
            resizable:true,
            toolbar:kendo.template($("#template").html()),


            columns: [
                { field: "name", title: "Tên", width: 100, template:" <a href='<?php echo '/admin/template/edit?id='  ?>#= id #'>#= name #</a> " },
                { field: "description", title: "Mô tả", width: 120 },
                { field: "file_name", title: "Tên file template", width: 120, values: allFileNames },
                { command:  [{name: "edit", text: "", className: "grd_edit_btn"},{name: "destroy", text: ""}],  title: "&nbsp;", width: 70 }

            ],
            editable: "popup"
        });
    });


</script>